<template>
  <div class="container">
    <el-row>
      <el-col :span="12">
        <span class="text-left float-left">{{lang._617}}</span>
      </el-col>
      <el-col :span="12">
        <el-button class="btn float-right" type="primary" round style="margin-right:10px;">{{lang._474}}</el-button>
        <el-button class="btn float-right" type="text" round style="margin-right:0">{{lang._475}}</el-button>
      </el-col>
    </el-row>
    <!--
             每个col 都是一行
             title 是标题，remark 是备注
             more_title 是右边要显示的文字，如果有这个则显示箭头，如果需要显示箭头又不显示文字，传个空格
             有个right 的插槽，适合右边需要自定义内容的 
         -->
    <el-row style="background:#FFF;border-radius:8px">
      <g-row :lang="lang" :title="lang._618" :remark="lang._619">
        <template slot="right">
            <el-button class="float-right" type="primary" round size="mini" style="margin:11px 10px 0 20px;">{{lang._078}}</el-button>
          <el-switch class="float-right switch" v-model="value3" active-text="开启" inactive-text="关闭">
          </el-switch>
        </template>
      </g-row>
      <g-row :lang="lang" :title="lang._620" :remark="lang._619">
        <template slot="right">
            <el-button class="float-right" type="primary" round size="mini" style="margin:11px 10px 0 20px;">{{lang._078}}</el-button>
          <el-switch class="float-right switch" v-model="value3" active-text="开启" inactive-text="关闭">
          </el-switch>
        </template>
      </g-row>
      <g-row :lang="lang" :title="lang._621" :remark="lang._619">
        <template slot="right">
            <el-button class="float-right" type="primary" round size="mini" style="margin:11px 10px 0 20px;">{{lang._078}}</el-button>
          <el-switch class="float-right switch" v-model="value3" active-text="开启" inactive-text="关闭">
          </el-switch>
        </template>
      </g-row>
      <g-row :lang="lang" :title="lang._622" :remark="lang._619">
        <template slot="right">
            <el-button class="float-right" type="primary" round size="mini" style="margin:11px 10px 0 20px;">{{lang._078}}</el-button>
          <el-switch class="float-right switch" v-model="value3" active-text="开启" inactive-text="关闭">
          </el-switch>
        </template>
      </g-row>
      <g-row :lang="lang" :title="lang._623" :remark="lang._619">
        <template slot="right">
            <el-button class="float-right" type="primary" round size="mini" style="margin:11px 10px 0 20px;">{{lang._078}}</el-button>
          <el-switch class="float-right switch" v-model="value3" active-text="开启" inactive-text="关闭">
          </el-switch>
        </template>
      </g-row>
      <g-row :lang="lang" :title="lang._624">
        <template slot="right">
            <el-button class="float-right" type="primary" round size="mini" style="margin:11px 10px 0 20px;">{{lang._078}}</el-button>
          
        </template>
      </g-row>
    </el-row>
  </div>
</template>
<style lang="less" scoped>
  .container {
    width: 860px;
    margin: 20px auto;
    .switch {
      margin-top: 10px;
      height: 30px;
      margin-right: 10px;
    }
    .btn {
      margin-top: 10px;
      height: 30px;
      line-height: 30px;
      padding: 0 20px;
      margin-left: 20px;
      margin-right: 20px;
    }
    span {
      font-size: 30px;
      color: #323644;
      line-height: 50px;
      margin: 0;
      padding-left: 10px;
    }
    .title,
    .more-title {
      font-size: 15px;
      color: #409EFF;
      font-family: "微软雅黑";
      line-height: 50px;
      margin-left: 10px;
    }
    .remark {
      font-size: 13px;
      color: #a2aebb;
      line-height: 50px;
      font-family: '微软雅黑';
      margin-left: 50px;
    } // .el-tooltip__popper{
    //   padding: 0 !important;
    // }
    // 二维码黑色边框
  }

</style>
<style>
  .el-textarea__inner {
    border: 0px !important
  }

</style>
<script>
  import grow from '../../components/row.vue'
  export default {
    props: ['lang'],
    components: {
      'g-row': grow
    },
    data() {
      return {
        value3: ''
      }
    }
  }

</script>
